<template>
    <div class="container">
        <div class="search-content">
            <el-form :model="searchContent" ref="searchFrom" :inline="true">
                <el-form-item prop="store_name" label="经销商名称：">
                    <el-input v-model="searchContent.store_name" placeholder="请输入" maxlength="32"></el-input>
                </el-form-item>
                <el-form-item prop="consult_type" label="审核状态：">
                    <el-select v-model="searchContent.status" placeholder="请选择">
                        <el-option
                            v-for="item in statusType"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="handleSearch">搜索</el-button>
                    <el-button type="primary" @click="handleReset">重置</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="search-list">
            <el-table 
                border 
                :data="dataList" 
                :height="oHeight">
                <el-table-column 
                    prop="id" 
                    align="center"
                    label="日志ID"
                    width="80">
                </el-table-column>
                <el-table-column
                    prop="store_name"
                    label="经销商名称"
                    key="store_name"
                    min-width="160"
                    align="center"
                    show-overflow-tooltip>
                    </el-table-column>
                <el-table-column
                    prop="recharge_amount"
                    label="充值金额"
                    min-width="120"
                    align="center"
                    key="recharge_amount">
                </el-table-column>
                <el-table-column
                    prop="surplus_amount"
                    label="剩余金额"
                    align="center"
                    key="surplus_amount"
                    min-width="120">
                </el-table-column>
                <el-table-column 
                    prop="remarks" 
                    label="备注" 
                    align="center"
                    key="remarks" 
                    min-width="250"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="addtime" 
                    align="center"
                    label="添加时间" 
                    key="addtime" 
                    min-width="160">
                </el-table-column>
                <el-table-column 
                    label="操作"
                    min-width="120"
                    align="center"
                    #default="{row}">
                    <el-button type="text" @click="messageBox(row)" v-if="parseInt(row.status) < 1">审核</el-button>
                    <el-button type="text" disabled v-else-if="parseInt(row.status) === 1">已审核</el-button>
                    <!--el-button type="text" disabled v-else>已拒绝</el-button-->
                </el-table-column>
            </el-table>
        </div>
        <div class="bottom flex-item">
            <div class="btn-group"></div>
            <div class="paginationOne">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="pageArr.curpage"
                    :page-sizes="[10, 20, 50, 100]"
                    :page-size="pageArr.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="pageArr.total">
                </el-pagination>
            </div>
        </div>
    </div>
</template>
<script>
import { resize } from "@/common/js/height.js";
import { objScreen } from "@/common/js/util.js";
export default {
    data() {
        return {
            searchContent: {
                store_name: '',       // 经销商名称
                status: '',           // 审核状态
                is_search: false      // 是否处于搜索
            },
            statusType: [
                {value: 0, label: '未审核'}, 
                {value: 1, label: '已审核'}, 
                // {value: 2, label: '已拒绝'}
            ],
            pageArr: {
                curpage: 1,           // 当前页码
                pageSize: localStorage.getItem('pageSize') * 1 || 10,         // 每页显示数量
                total: 0              // 数据总数
            },
            dataList: [],             // 列表数据
            oHeight: 600,             // 默认高度, 其值会在mounted中的resize进行重新计算
        }
    },
    methods: {
        async getData(action = null) {
            let datas = {
                pagesize: this.pageArr.pageSize,
                curpage: this.pageArr.curpage
            }
            if(this.searchContent.is_search) {
                datas = {...datas, ...this.searchContent};
            }
            datas = objScreen(datas);
            const res = await this.$http.post('/admin/store/index.php?act=smsRecharge&op=smsLogList', datas)
            if(res.code == 1) {
                this.dataList = res.data
                this.pageArr.total = parseInt(res.show_page.TotalNum)
            }
        },
        handleExamine({ id, store_id }, status) {
            this.$http.post('/admin/store/index.php?act=smsRecharge&op=smsReview', {id, store_id, status})
            .then(res => {
                if (res.code == 1) {
                    this.$message.success('操作成功')
                    this.getData()
                } else {
                    this.$message.error(`${res.msg}`)
                }
            })
            .catch(error => this.$message.error(`${error}`))
        },
        messageBox(row) {
            this.$confirm('通过审核？', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                // cancelButtonClass: 'el-button--danger',
                distinguishCancelAndClose: true,
                type: 'warning'
            }).then(res => {
                this.handleExamine(row, 1)
            }).catch(action => {
                if (action === 'cancel') {
                    // this.handleExamine(row, 2)
                }
            })
        },
        handleSizeChange(pageSize) {
            localStorage.setItem('pageSize', pageSize);
			this.pageArr.pageSize = pageSize;
			this.pageArr.curpage = 1;
			this.getData();
        },
        handleCurrentChange(page) {
			this.pageArr.curpage = page;
			this.getData();
        },
        handleSearch() {
            if(!this.searchContent.is_search) this.searchContent.is_search = true;
            this.pageArr.curpage = 1;
            this.getData();
        },
        handleReset() {
            this.$refs.searchFrom.resetFields();
            if(!this.searchContent.is_search) return;
            this.searchContent = {
                is_search: false
            }
            this.pageArr.curpage = 1;
            this.getData();
        },
    },
    created() {
        this.getData()
    },
	mounted() {
		resize(this)
	}
}
</script>
<style lang="scss" scoped>
.bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
</style>
